import React from 'react'
import {connect} from 'react-redux'
import {bindActionCreators} from 'redux'
import {actions} from '../../reducers'
import {actions as AssignActions} from '../../reducers/assign'

import Rate from '../../components/rate'
import history from '../../history'
import utils from '../../common/utils'
import {post} from '../../axios'

class Assigned extends React.Component {
    constructor(props) {
        super(props)
    }

    componentDidMount() {
    }

    assign = () => {
        const project_id = utils.getQueryString('project_id'),
              data = {ids: this.props.selected.map(x=>x.id)}
        this.props.assign(project_id, data)
    }

    render () {
        const project_id = utils.getQueryString('project_id'),
              data = this.props.selected
        return(
            <div className='distribution'>
                <p className='title'>当前已选择</p>
                <div class="soso-list" style={{marginBottom: '75px'}}>
                {
                    data.map(x => 
                        <div class="soso-row" key={x.id}>
                            <div class="soso-lt">
                                <div class="name">{x.nickname}</div>
                                <div class="grade">
                                    <Rate
                                        value={x.rank}
                                        count={6}
                                        disabled={true}
                                    />
                                </div>
                            </div>
                        </div>
                    )
                }
                </div>
                <div className="btns">
                    <a className="contact" onClick={()=>history.push(`/assign/add?project_id=${project_id}`)}>添加</a>
                    <a className="contact" onClick={this.assign}>分配</a>
                </div>
            </div>
        )
    }
}

function mapStateToProps(state) {
    return {
        selected: state.assign.selected,
    }
}
  
function mapDispatchToProps(dispatch) {
    return  {
        assign: bindActionCreators(AssignActions.assign, dispatch)
    }
}
  
export default connect(
    mapStateToProps,
    mapDispatchToProps
)(Assigned)